<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="d" uri="/WEB-INF/resource.tld"%>
<!DOCTYPE html>
<html lang="zh-CN">

<head>

<%@ include file="/WEB-INF/include/meta.jsp"%>
<%@ include file="/WEB-INF/include/css.jsp"%>

<title>订单确认</title>
<meta name="description" content="">
<meta name="keyword" content="关键字1，关键字2，—">

</head>
<!-- end header -->
<body>
  <div class="page-group">
    <div class="page page-current moyu-page" style="background-color: #F8F8F8;">
      <header class="bar bar-nav shop-header">
        <h1 class="title">订单确认</h1>
      </header>
      
      <div class="content" style="background-color: #F8F8F8;">
        <div class="card">
          <div class="card-header">
          <img src="${ctx.resource}/image/logo.png" alt="" />
          </div>
          <div class="card-content">
            <div class="list-block media-list">
              <ul>
                <li class="item-content">
                  <div class="item-media">
                    <img src="${ctx.resource}/image/moyu/moyu-1.jpeg" width="44">
                  </div>
                  <div class="item-inner">
                    <div class="item-title-row">
                      <div class="item-title">人马君 乐在美味即食魔芋拌面（肽+） 轻卡低热量 减脂餐 魔芋面主食品方便即食速食</div>
                    </div>
                    <div class="item-subtitle">
                      <c:choose>
                        <c:when test="${param.type == 1}">
                          香辣钵钵鸡味6盒
                        </c:when>
                        <c:when test="${param.type == 2}">
                          葱油鸡汁味6盒
                        </c:when>
                        <c:when test="${param.type == 3}">
                          香辣钵钵鸡味3盒+葱油鸡汁味3盒
                        </c:when>
                        <c:otherwise>
                        
                        </c:otherwise>
                      </c:choose>
                    </div>
                    <div class="item-subtitle clearfix">
                      <p class="pull-left single-price">
                        <span>￥</span>118
                      </p>
                      <p class="pull-right amount">
                        <span>x</span>${param.amount}
                      </p>
                    </div>
                  </div>
                </li>
              </ul>
            </div>
          </div>
          <div class="card-footer">
            <div></div>
            <div>
              <span class="total-amount">共${param.amount}件</span> <span>商品小计：<span class="price-symbol">￥<span class="price">
                <fmt:formatNumber value="${totalPrice}" pattern="00.00"></fmt:formatNumber>
              </span></span></span>
            </div>
          </div>
        </div>
        
        
       
     <c:choose>
       <c:when test="${empty defaultAddress}">
       <input type="hidden" name="nameValue">
        <input type="hidden" name="mobileValue">
        <input type="hidden" name="pcdValue">
        <input type="hidden" name="addressValue">
         <a href="#" class="open-popup empty-address"  data-popup=".select-pop" style="display: block; color: unset !important;">
           <div class="card">
            <div class="card-content">
              <div class="card-content-inner" style="padding: 0.75rem;">
                <p>暂无任何地址</p>
                <h3>请点击新建收货地址</h3>
              </div>
            </div>
          </div>
         </a>
         
         <a href="javascript:void(0);" class="address-info open-select-popup hide" style="display: block; color: unset !important;">
          <div class="card">
            <div class="card-header">配送方式：快递</div>
            <div class="card-content">
              <div class="card-content-inner clearfix"  style="padding: 0 0.75rem 0.75rem 0.75rem;">
                <div class="pull-left clearfix" style="width: 90%;">
                  <p style="margin: 0px;" class="clearfix">
                    <label class="pull-left" style="width: 70px; text-align: right;">收货人：</label>
                    <span class="pull-left user-info" style="width: 70%;  max-width: 230px; text-align: left;">
                    </span>
                  </p>
                  <p style="margin-top: 0px;"  class="clearfix">
                  <label class="pull-left" style="width: 70px; text-align: right;">收货地址：</label>
                  <span class="pull-left address-detail" style="width: 70%; max-width: 230px; text-align: left;"></span></p>
                </div>
                <div class="pull-right clearfix">
                  <span>修改<span class="icon icon-right"></span></span>
                </div>
              </div>
            </div>
          </div>
          </a>
         
       </c:when>
       <c:otherwise>
       <input type="hidden" name="nameValue" value="${defaultAddress.name}">
        <input type="hidden" name="mobileValue" value="${defaultAddress.mobile}">
        <input type="hidden" name="pcdValue" value="${defaultAddress.pcd}">
        <input type="hidden" name="addressValue" value="${defaultAddress.address}">
         <a href="#" class="open-popup address-info" data-popup=".select-popup" style="display: block; color: unset !important;">
          <div class="card">
            <div class="card-header">配送方式：快递</div>
            <div class="card-content">
              <div class="card-content-inner clearfix"  style="padding: 0 0.75rem 0.75rem 0.75rem;">
                <div class="pull-left clearfix" style="width: 90%;">
                  <p style="margin: 0px;" class="clearfix">
                    <label class="pull-left" style="width: 70px; text-align: right;">收货人：</label>
                    <span class="pull-left user-info" style="width: 70%;  max-width: 230px; text-align: left;">
                      ${defaultAddress.name}（${defaultAddress.mobile}）
                    </span>
                  </p>
                  <p style="margin-top: 0px;"  class="clearfix">
                  <label class="pull-left" style="width: 70px; text-align: right;">收货地址：</label>
                  <span class="pull-left address-detail" style="width: 70%; max-width: 230px; text-align: left;">${defaultAddress.pcd} ${defaultAddress.address}</span></p>
                </div>
                <div class="pull-right clearfix">
                  <span class="icon icon-right"></span>
                </div>
              </div>
            </div>
          </div>
          </a>
       </c:otherwise>
     </c:choose>

      </div>
      <!-- End Content -->
      <nav class="bar bar-footer product-detail-footer shop-footer clearfix">
        <div class="pull-left">
          <p>应付：<span class="price-symbol">￥<span class="price"><fmt:formatNumber value="${totalPrice}" pattern="00.00"></fmt:formatNumber></span></span></p>
        </div>
        <div  class="pull-right">
          <p style="margin-top: .3rem;"><a href="javascript:void(0);" class="button button-order">提交订单</a></p>
        </div>
      </nav>
    </div>
  </div>
  
  <div class="popup popup-about select-pop select-popup moyu-page" style="position: relative;">
    <p style="position: absolute;width: 30px;line-height: 30px;color: #333;right: 10px;z-index: 999;margin: 0px;display: block;text-align: center;top: 5px;right: 5px;"><a href="#" class="close-popup"><span class="icon icon-down" style="color: #333;"></span></a></p>
    <div class="content-block">
      <div class="card" style="margin: 0px;">
          <div class="card-content">
            <div class="list-block">
              <ul>
                <!-- Text inputs -->
                <li>
                  <div class="item-content">
                    <div class="item-inner">
                      <div class="item-media"><i class="icon icon-card"></i></div>
                      <div class="item-title label">收货人</div>
                      <div class="item-input">
                        <input type="text" name="name">
                      </div>
                    </div>
                  </div>
                </li>
                <li>
                  <div class="item-content">
                    <div class="item-inner">
                      <div class="item-media"><i class="icon icon-phone"></i></div>
                      <div class="item-title label">手机号码</div>
                      <div class="item-input">
                        <input type="text" name="mobile">
                      </div>
                    </div>
                  </div>
                </li>
                <li>
                  <div class="item-content">
                    <div class="item-inner">
                      <div class="item-media"><i class="icon icon-browser"></i></div>
                      <div class="item-title label">所在地区</div>
                      <div class="item-input">
                        <input type="text" id='city-picker' name="pcd" value="">
                      </div>
                    </div>
                  </div>
                </li>
                <li class="align-top">
                  <div class="item-content">
                    <div class="item-inner">
                      <div class="item-media" style="padding-top: 5px;"><i class="icon icon-edit"></i></div>
                      <div class="item-title label">详细地址</div>
                      <div class="item-input">
                        <textarea name="address" style="text-align: right;"></textarea>
                      </div>
                    </div>
                  </div>
                </li>
              </ul>
              <%-- <p style="margin-top: 10px;"><a href="${ctx.host}/moyu/shop?type=1&amount=1" class="button button-fill button-danger go-btn">确定地址</a></p> --%>
              <div class="content-block">
                <p class="buttons-row">
                  <a href="javascript:void(0);" class="button button-success button-fill button-round wechat-address" style="color: #fff;">微信获取</a>
                  <a href="javascript:void(0);" class="button button-info button-fill button-round add-address"  style="color: #fff;">手动添加</a>
                </p>
              </div>
            </div>
          </div>
        </div>
    </div>
  </div>
  
  <div class="popup popup-about list-popup moyu-page" style="position: relative;">
    <p style="position: absolute;width: 30px;line-height: 30px;color: #333;right: 10px;z-index: 999;margin: 0px;display: block;text-align: center;top: 5px;right: 5px;"><a href="#" class="close-popup"><span class="icon icon-down" style="color: #333;"></span></a></p>
    <div class="content-block" style="padding: 0px;">
      <div class="list-block media-list">
        <ul>
          <li>
            <label class="label-checkbox item-content">
              <input type="radio" name="my-radio">
              <div class="item-media"><i class="icon icon-form-checkbox"></i></div>
              <div class="item-inner">
                <div class="item-title-row">
                  <div class="item-title">张三</div>
                  <div class="item-after">17621360181</div>
                </div>
                <div class="item-subtitle">上海市 普陀区</div>
                <div class="item-text" style="white-space: break-spaces; text-overflow: unset;">Lorem ipsum dolor sit amet...Lorem ipsum dolor sit amet...Lorem ipsum dolor sit amet...</div>
              </div>
            </label>
          </li>
          <li>
            <label class="label-checkbox item-content">
              <input type="radio" name="my-radio">
              <div class="item-media"><i class="icon icon-form-checkbox"></i></div>
              <div class="item-inner">
                <div class="item-title-row">
                  <div class="item-title">剪刀</div>
                  <div class="item-after">17:14</div>
                </div>
                <div class="item-subtitle">New messages from John Doe</div>
                <div class="item-text" style="white-space: break-spaces; text-overflow: unset;">Lorem ipsum dolor sit amet...Lorem ipsum dolor sit amet...Lorem ipsum dolor sit amet...</div>
              </div>
            </label>
          </li>
        </ul>
        
        
        <div class="content-block">
          <p><a href="javascript:void(0);" class="open-popup button button-round add-new button-info button-fill" data-popup=".select-popup">新增地址</a></p>
        </div>
        
      </div>
    </div>
  </div>

  <%@ include file="/WEB-INF/include/script.jsp"%>
  <d:resource type="script" root="${ctx.resource}/build" src="js/page/product/moyu-shop.js" />
  <script type="text/javascript">
      var jsConfig = JSON.parse('${wechatJsConfig}')
      require(['page/product/moyu-shop'], function(page) {
        page.init({
          jsConfig: jsConfig,
          amount: '${param.amount}',
          type: '${param.type}',
        })
      })
    </script>

</body>
</html>